import React from 'react';
import { Card, Row, Col, Statistic, List, Typography, Divider, Steps, Tag } from 'antd';
import { FileOutlined, SolutionOutlined, ScheduleOutlined, CheckCircleOutlined } from '@ant-design/icons';

const { Title, Paragraph } = Typography;

/**
 * 应聘者仪表盘页面
 * 显示应聘进度和相关信息
 */
const CandidateDashboard = () => {
    // 模拟数据
    const stats = [
        { title: '简历投递', value: 5, icon: <FileOutlined /> },
        { title: '面试邀请', value: 2, icon: <ScheduleOutlined /> },
        { title: '待参加面试', value: 1, icon: <SolutionOutlined /> },
        { title: '录用通知', value: 0, icon: <CheckCircleOutlined /> }
    ];

    const applications = [
        { position: '前端开发工程师', company: '技术部', status: '面试中', date: '2023-06-15' },
        { position: 'UI设计师', company: '设计部', status: '已投递', date: '2023-06-10' },
        { position: '产品经理', company: '产品部', status: '已拒绝', date: '2023-05-28' },
    ];

    // 应聘进度
    const currentApplication = {
        position: '前端开发工程师',
        currentStep: 2,
        steps: [
            { title: '简历投递', description: '已完成' },
            { title: '简历筛选', description: '已通过' },
            { title: '技术面试', description: '进行中' },
            { title: 'HR面试', description: '待安排' },
            { title: '录用', description: '待定' }
        ]
    };

    // 获取状态标签
    const getStatusTag = (status) => {
        switch(status) {
            case '面试中':
                return <Tag color="processing">面试中</Tag>;
            case '已投递':
                return <Tag color="default">已投递</Tag>;
            case '已拒绝':
                return <Tag color="error">已拒绝</Tag>;
            case '已录用':
                return <Tag color="success">已录用</Tag>;
            default:
                return <Tag>{status}</Tag>;
        }
    };

    return (
        <div>
            <Title level={2}>应聘者仪表盘</Title>
            <Paragraph>欢迎回来，您可以在这里查看您的应聘进度和相关信息。</Paragraph>
            
            <Row gutter={[16, 16]}>
                {stats.map((stat, index) => (
                    <Col xs={24} sm={12} md={6} key={index}>
                        <Card>
                            <Statistic 
                                title={stat.title}
                                value={stat.value}
                                prefix={stat.icon}
                            />
                        </Card>
                    </Col>
                ))}
            </Row>

            <Divider orientation="left">应聘进度</Divider>
            
            <Row gutter={[16, 16]}>
                <Col xs={24}>
                    <Card title={`当前应聘: ${currentApplication.position}`}>
                        <Steps 
                            current={currentApplication.currentStep}
                            items={currentApplication.steps.map(step => ({
                                title: step.title,
                                description: step.description
                            }))}
                        />
                    </Card>
                </Col>
            </Row>

            <Divider orientation="left">我的申请</Divider>
            
            <Row gutter={[16, 16]}>
                <Col xs={24}>
                    <Card>
                        <List
                            dataSource={applications}
                            renderItem={(item) => (
                                <List.Item
                                    actions={[getStatusTag(item.status)]}
                                >
                                    <List.Item.Meta
                                        title={item.position}
                                        description={`${item.company} · 申请日期: ${item.date}`}
                                    />
                                </List.Item>
                            )}
                        />
                    </Card>
                </Col>
            </Row>
        </div>
    );
};

export default CandidateDashboard;